<!--
 * @Version: 1.0
 * @Date: 2021-04-24 17:47:15
 * @LastEditTime: 2021-12-09 10:15:19
 * @Description:
-->
<template>
  <div v-loading="loadingUps">
    <div v-if="code && dataObj.tracking_info" style="min-height:200px">
      <div v-if="type !== '1'&&type !== '3'" style="margin-bottom:30px; margin-left:30px;">
        <el-row>
          <el-col :span="5">
            <span>快递：{{ dataObj.shipping_name }}</span>
          </el-col>
          <el-col :span="10">
            <span>快递单号：{{ dataObj.shipping_code }} </span>
          </el-col>
          <el-col v-if="dataObj.platform_id !== 3 && dataObj.platform_id !== 4" :span="6">
            <span>运费：{{ dataObj.freight_weight_price_all }}</span>
          </el-col>
          <el-col :span="6">
            <span>币别：- </span>
          </el-col>
        </el-row>
      </div>
      <div v-loading="loadingUpsnew" style="min-height:200px">
        <div v-if="deliveryUsps && deliveryUsps.TrackSummary">
          <el-timeline>
            <div v-if="deliveryUsps.TrackSummary">
              <el-timeline-item :timestamp="`${deliveryUsps.TrackSummary.EventDate}  ${deliveryUsps.TrackSummary.EventTime}`" placement="top">
                {{ deliveryUsps.TrackSummary.Event }}，{{ deliveryUsps.TrackSummary.EventCity }}，{{ deliveryUsps.TrackSummary.EventState }}，{{ deliveryUsps.TrackSummary.EventZIPCode }}
              </el-timeline-item>
            </div>
            <div v-if="deliveryUsps.TrackDetail">
              <el-timeline-item v-for="(item, index) in deliveryUsps.TrackDetail" :key="index" :timestamp="`${item.EventDate}  ${item.EventTime}`" placement="top">
                <div style="margin-right:10px;word-wrap:break-word;word-break:break-all;">
                  {{ item.Event }}，{{ item.EventCity }}，{{ item.EventState }}，{{ item.EventZIPCode }}
                </div>
              </el-timeline-item>
            </div>

          </el-timeline>
        </div>
        <div v-else>
          <div v-if="deliveryUsps && deliveryUsps.TrackSummary">
            <el-timeline>
              <div v-if="deliveryUsps.TrackSummary">
                <el-timeline-item :timestamp="`${deliveryUsps.TrackSummary.EventDate}  ${deliveryUsps.TrackSummary.EventTime}`" placement="top">
                  {{ deliveryUsps.TrackSummary.Event }}，{{ deliveryUsps.TrackSummary.EventCity }}，{{ deliveryUsps.TrackSummary.EventState }}，{{ deliveryUsps.TrackSummary.EventZIPCode }}
                </el-timeline-item>
              </div>
            </el-timeline>
          </div>
          <div v-if="deliveryUsps && !deliveryUsps.TrackSummary">
            {{ deliveryUsps }}
          </div>
        </div>
      </div>
    </div>
    <div v-else class="defalutPage">
      <i class="el-icon-truck " style="font-size: 81px;color: #aaaaaa;" />
      <p>暂无物流信息</p>
    </div>
  </div>
</template>

<script>
import { deliveryUspsTracking } from '@/utils/publicData'
export default {
  props: {
    dataObj: {
      type: Object,
      default: () => { }
    },
    code: {
      type: String,
      default: ''
    },
    type: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      deliveryUsps: [],
      loadingUps: true,
      loadingUpsnew: true
    }
  },
  created() {
    if (this.code) {
      this.loadingUps = true
      if (Number(this.type) === 3) {
        if (this.dataObj.tracking_info) {
          this.deliveryUsps = this.dataObj.tracking_info
        }
      } else {
        if (Number(this.dataObj.delivery_state) !== 6 && Number(this.dataObj.logistics_type) === 1) {
          if (this.dataObj.tracking_info) {
            const dataArr = JSON.parse(this.dataObj.tracking_info)
            this.deliveryUsps = dataArr
            this.deliveryUspsTracking()
            this.deliveryUsps = false
          } else {
            this.deliveryUspsTracking()
          }
        }
      }
    }
    this.loadingUps = false
  },
  methods: {
    // usps deliveryUspsTracking;
    deliveryUspsTracking() {
      this.loadingUpsnew = true
      const codeItem = this.code
      deliveryUspsTracking(codeItem).then((data) => {
        // this.deliveryUps = data
        if (data) {
          this.dataObj.tracking_info = data
          this.deliveryUsps = data
        }
        this.loadingUpsnew = false
      }).catch(() => {
        this.loadingUpsnew = false
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
